<template>
	<!-- 
		瀑布流横向实现flex
		备注：容器必须有固定高度且高度大于最高的列高  固定高度可以根据当前渲染内容自行计算
	 -->
	<view class="container">
		<view :class="{'three':item.three}" class="item" v-for="(item,index) in imageList"  >
			<image  :src="item.imageurl"  @tap="jumpphotodetail(item.id)" mode="aspectFill"></image>			
		</view>
		
	</view>
</template>

<script>
	import http from '../../utils/http.js';
	export default {
		data() {
			return {
				imageList:[],
				height:"",
				three:false,
				panduan:[],
				
			}
		},
		mounted:function(){
		
		},	
		methods: {
			
			shuaxin:function(){
				//this.goodsListCount.length=0;
				var that = this;
				http.showMyPhoto({
					openid:uni.getStorageSync("openid")
				}).then(list=>{
					console.log(list);
					
					for(var i = 0; i<list.data.length;i++){
						if(i%3==0){
							list.data[i]['three']=true
						}else{
							list.data[i]['three']=false
						}
					}
					that.imageList = list.data;
					console.log("three",list.data);
					console.log(that.imageList[0].imageurl)
					console.log(that.imageList.length)
					uni.setStorageSync("yifabu",that.imageList.length);
					if(uni.getStorageSync("yifabu").length==0 ){
						uni.setStorageSync("yifabu",0);
					}
				
				})	
				
			
			},
			jumpphotodetail:function(url){
				
				uni.navigateTo({
					url:"./photodetail?url="+url
				})
			},
			
		}
	}
</script>

<style scoped lang="scss">
	.container {
	width: 750upx;
	margin-top: 50UPX;
	overflow-x: hidden;
	}
	
	.item {
		float: left;
		width: 250upx;
		height: 250upx;
	}
	image{
		width: 250upx;
		height: 250upx;
	}
::-webkit-scrollbar {
		width: 0;
		height: 0;
		background-color: transparent;
	} 
</style>